<template>
  <div>
    <el-select v-if="type=='product'" v-model="selectedValue" placeholder="请选择产品名称" clearable @change="handleSelectProduct">
      <el-option
        v-for="(product, index) in productsList"
        :key="product.index"
        :label="product.productName"
        :value="product.productId"
      />
    </el-select>
  </div>
</template>

<script>
import {listProducts} from "@/api/inventory/products";

export default {
  name: "Select",
  props: {
    value: {
      type: [String, Number, Array],
      default: ''
    },
    type:{
      type: String,
      default: ''
    }
  },
  created() {
    this.getProductsList();
  },
  data() {
    return {
      // 产品表格数据
      productsList: [],
    }
  },

  computed: {
    selectedValue: {
      get() {
        return this.value;
      },
      set(val) {
        this.$emit('input', val);
      }
    }
  },


methods: {
  /** 查询产品列表 */
  getProductsList() {
    this.loading = true;
    listProducts({pageSize: 10000}).then(response => {
      this.productsList = response.rows;
    });
  },
  handleSelectProduct(productId) {
    let selectedProduct=null;
    console.log("this.productsList",this.productsList)
    selectedProduct = this.productsList.find(product =>
      product.productId === productId
    );

    this.$emit('selectData', selectedProduct );
  }
  },
};
</script>





